Помогите разобраться почему Promise изначально в состоянии fulfilled?

[Konstantin81]

Помогите пожалуйста разобраться:

Почему async функция, тело которой имеет setTimeout, возвращает Promise в состоянии fulfilled еще до выполнения setTimeout?

Откуда берется значение Promise - '1' ?

Каким должен быть правильный код (при котором Promise перейдет в состояние fulfilled лишь после выполнения setTimeout)?

let out1 = document.querySelector('.out-1');

async function setHtml(ms, out, text) {

	let a = setTimeout(() => out.innerHTML = text, ms);
	return a;
}

console.log(setHtml(2000, out1, 'Запуск №1'));

Весь код
https://codepen.io/konstantinopol/pen/jOVEyGK


____________________

[Nexus]

Почему async функция, тело которой имеет setTimeout возвращает Promise в состоянии fulfilled еще до выполнения setTimeout?

Потому что вы возвращает идентификатор таймаута не ожидая его выполнения.

Откуда берется значение Promise - '1' ?

Это сам идентификатор таймаута.

Каким должен быть правильный код?

Наверное таким:

let out1 = document.querySelector('.out-1');

function setHtml(ms, out, text) {
    return new Promise(resolve => {
        setTimeout(() => resolve(out.innerHTML = text), ms);
    });
}

setHtml(2000, out1, 'Запуск №1').then(text => {
    console.log(text);
});

[Konstantin81]

let out1 = document.querySelector('.out-1');

function setHtml(ms, out, text) {
    return new Promise(resolve => {
        setTimeout(() => resolve(out.innerHTML = text), ms);
    });
}

setHtml(2000, out1, 'Запуск №1').then(text => {
    console.log(text);
});

Имеется в виду:
1) что функция async не может создать Promise в состоянии pending?
2) что функция async await может вернуть созданный ей самой Promise только в состоянии fulfilled?
3) что функция async возвращает в состоянии pending только те Promise, которые созданы с помощью new Promise или браузером(например fatch)?

[Nexus]

Konstantin81, вы заострили внимание совсем не на том, на чем нужно из-за этого сделали какие-то дикие выводы.

Разберитесь что делает ваш код, как работает setTimeout, как, собственно, работает async/await.

В вашем коде нет чего-либо, что выполняется асинхронно, поэтому результат всегда - Promise<number>в состоянии «fulfilled».

[Konstantin81]

Konstantin81, вы заострили внимание совсем не на том, на чем нужно из-за этого сделали какие-то дикие выводы.

Разберитесь что делает ваш код, как работает setTimeout, как, собственно, работает async/await.

В вашем коде нет чего-либо, что выполняется асинхронно, поэтому результат всегда - Promise<number>в состоянии «fulfilled».

Я думал setTimeout выполняется асинхронно.
Спасибо Вам!!!

[Nexus]

Я думал setTimeout выполняется асинхронно.

Выполнение callback'а этой функции действительно откладывается на определенное время, однако в вашем коде совершенно неважно когда это произойдет и произойдет ли вообще.

Функция setTimeout сразу же возвращает свой идентификатор, поэтому вашей асинхронной функции setHtml вовсе нет нужды ждать выполнения функции обратного вызова, которая была передана в setTimeout.

Как можно воспользоваться async/await вместе с таймаутом и без явного использования Promis'ов - я не представляю.

[voraa]

что функция async возвращает в состоянии pending только те Promise, которые созданы с помощью new Promise или браузером(например fatch)?

А какие еще бывают?

[Alexandroppolus]

Имеется в виду:
1) что функция async не может создать Promise в состоянии pending?
2) что функция async await может вернуть созданный ей самой Promise только в состоянии fulfilled?
3) что функция async возвращает в состоянии pending только те Promise, которые созданы с помощью new Promise или браузером(например fatch)?

async функция может вернуть созданный ей самой промис в состоянии pending, если внутри неё делается return значения thenable (то есть любого объекта, у которого есть метод then, или даже примитива, если then добавить ему в прототип)